/**
 * Created by gengrong on 16/4/14.
 */
import { SmartForm } from 'comps/common';
import { Form, Input, Switch, Row, Col, Button } from 'antd';
import ManagedDevTeamSelection from '../containers/selection/managed-dev-team-select';
import ManagedCompanySelection from '../containers/selection/managed-company-select';
import * as React from 'react';

class RunnableGroupForm extends React.Component {

  constructor(props) {
    super(props);
    this.state = {
      createState: {}
    };
  }

  onSubmit(evt) {
    evt.preventDefault();
    this.props.smartSubmit((values) => {
      return this.props.onSaveRunnableGroup(values);
    });
  }

  checkKey(r, value, callback) {
    if (/^[a-zA-Z][a-zA-Z0-9-]*$/.test(value)) {
      callback();
    } else {
      callback('以大小写字母开头，可包含大小写字母，数字或 -');
    }
  }

  onCompanySelected(companyId) {
    this.props.onCompanyChange(companyId)
  }

  onDevTeamSelected(devTeamId) {
    this.props.onDevTeamChange(devTeamId)
  }

  render() {
    const { getFieldProps } = this.props.form;
    const nameProps = getFieldProps('name', {
      rules: [
        { required: true, message: '请填写项目名称' }
      ],
      trigger: ['onBlur', 'onChange']
    });
    const keyProps = getFieldProps('key', {
      rules: [
        { required: true, message: '请填写项目 key' },
        { validator: this.checkKey.bind(this) }
      ],
      trigger: ['onBlur', 'onChange']
    });
    const publicProps = getFieldProps('public', {
      initialValue: true
    });
    const companyProps = getFieldProps('companyId', {
      rules: [
        { required: true, message: '请选择项目所属企业' }
      ],
      trigger: ['onBlur', 'onChange']
    });
    const teamProps = getFieldProps('teamId', {
      initialValue: [],
      rules: [
        { required: true, message: '请选择项目所属开发组' }
      ],
      trigger: ['onBlur', 'onChange']
    });
    return (
      <Form horizontal form={this.props.form} onSubmit={::this.onSubmit}>
        <Form.Item labelCol={{ span: 4 }} wrapperCol={{ span: 20 }} label='名称：'>
          <Input {...nameProps} required placeholder='输入项目名称'/>
        </Form.Item>
        <Form.Item labelCol={{ span: 4 }} wrapperCol={{ span: 20 }} label='key：'>
          <Input {...keyProps} required placeholder='输入项目Key'/>
        </Form.Item>
        <Form.Item labelCol={{ span: 4 }} wrapperCol={{ span: 20 }} label='所属企业：'>
          <ManagedCompanySelection {...companyProps} onSelect={::this.onCompanySelected}/>
        </Form.Item>
        <Form.Item labelCol={{ span: 4 }} wrapperCol={{ span: 20 }} label='所属开发组：'>
          <ManagedDevTeamSelection style={{ width: '100%' }} {...teamProps} onSelect={::this.onDevTeamSelected}/>
        </Form.Item>
        <Form.Item labelCol={{ span: 4 }} wrapperCol={{ span: 20 }} label='描述：'>
          <Input type='textarea' {...getFieldProps('desc')} placeholder='输入项目描述'/>
        </Form.Item>
        <Form.Item labelCol={{ span: 4 }} wrapperCol={{ span: 20 }} label='是否公开：'>
          <Switch defaultChecked='true' {...publicProps}/>
        </Form.Item>
        <Row>
          <Col span='18' offset='4'>
            <Button loading={this.props.submiting} type='primary' htmlType='submit'>提交</Button>
          </Col>
        </Row>
      </Form>
    );
  }
}

RunnableGroupForm = Form.create({})(SmartForm.beSmart()(RunnableGroupForm));

export default RunnableGroupForm;
